<template>
  <div class="main-nav">
    <nav-bar class="home-nav">
      <div class="left" slot="left" @click="goBack"><van-icon name="arrow-left" size="24" /></div>
      <div slot="center">数据异常设备</div>
    </nav-bar>
    <div v-if="!isNoData">
      <div class="record_box">
        <div class="bases-equip" v-for="item in equipList">
          <div class="greenhouses">
            <div class="greenhouses-one">
              <div>{{item.base_name}}-{{item.house_name}}<span>【{{item.pro_name}}】</span></div>
            </div>
          </div>
          <div class="eq-downs">
            <div class="equipments" v-for="items in item.equip_info">
              <div class="equip-conf">
                <div class="equip-one">
                  <div class="equip-one-o">{{items.name}}</div>
                  <div class="equip-one-t wd" v-if="items.type==1">
                    <div>温度</div>
                  </div>
                  <div class="equip-one-t sd" v-else>
                    <div>湿度</div>
                  </div>
                </div>
                <div class="equip-two">
                  <div class="equip-two-o">
                    <div class="equip-two-o-o">{{items.sources}}</div>
                    <div class="equip-two-o-t" v-if="items.type==1">℃</div>
                    <div class="equip-two-o-t" v-else>%</div>
                  </div>
                  <div class="equip-two-t" v-if="items.type==1">当前温度</div>
                  <div class="equip-two-t" v-else>当前湿度</div>
                  <div class="equip-two-f" v-if="items.scope==1">
                    <div class="equip-img"><img src="@/assets/images/down.png"/></div>
                    <div class="equip-fw scope low">低于正常范围内</div>
                  </div>
                  <div class="equip-two-f" v-else>
                    <div class="equip-img"><img src="@/assets/images/up.png"/></div>
                    <div class="equip-fw scope low">高于正常范围内</div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div v-else>
      <no-data></no-data>
    </div>
  </div>
</template>

<script>
  import NavBar from "@/components/common/navbar/NavBar";
  import noData from "@/components/content/nodata";
  export default {
    name: "tempary",
    components:{
      noData,
      NavBar
    },

    data(){
      return {
        isNoData:false,
        type:0,
        equipList: [],
      }
    },

    created() {
      this.type = this.$route.query.type;
      this.getAbnomalList()
    },
    methods: {
      goBack(){
        this.$router.go(-1);
      },
      getAbnomalList() {
        let that = this;
        that.$http.get('/api/monitorApi/check_abnomal_equip', {type:that.type}, r => {
          that.equipList = r.data;
          if(r.data.length==0){
            that.isNoData=true;
          }
        })
      },
    }
  }
</script>

<style scoped>
  .record_box{
    margin: 10px;
    background: #ffffff;
    border-radius: 8px;
  }
  .record_box .title {
    padding: 10px;
  }
  .record_box .title h2{
    padding-left: 5px;
    font-size: .32rem;
    /*color: var(--color-tint);*/
    border-left: 3px solid var(--color-tint);
    font-weight: normal;
  }

</style>
